<template>
   
  <div class="ibox float-e-margins">
    <div class="ibox-title">
      <h5>最新动态</h5>
      <div class="ibox-tools">
        <a class="collapse-link ui-sortable"
          ><i class="fa fa-chevron-up"></i
        ></a>
        <a data-toggle="dropdown" href="index.html#" class="dropdown-toggle"
          ><i class="fa fa-wrench"></i
        ></a>
        <ul class="dropdown-menu dropdown-user">
          <li><a href="index.html#">选项1</a></li>
          <li><a href="index.html#">选项2</a></li>
        </ul>
        <a class="close-link"><i class="fa fa-times"></i></a>
      </div>
    </div>
    
    <div class="ibox-content no-padding">
      <ul class="list-group">
        <li class="list-group-item" v-bind:key="i" v-for="(thenews,i) in newses">
          <p>
            <a href="index.html#" class="text-info">{{thenews.topic}}</a>
            {{thenews.title}}
          </p>
          <small class="block text-muted"
            ><i class="fa fa-clock-o"></i> {{thenews.time}}</small>
        </li>
        
      </ul>
    </div>
  </div>
  <!--
<div class="ibox float-e-margins">
    <div class="ibox-title">
        <h5>最新动态</h5>
        <div class="ibox-tools">
            <a class="collapse-link ui-sortable">
                <i class="fa fa-chevron-up"></i>
            </a>
            <a class="dropdown-toggle" data-toggle="dropdown" href="index.html#">
                <i class="fa fa-wrench"></i>
            </a>
            <ul class="dropdown-menu dropdown-user">
                <li><a href="index.html#">选项1</a>
                </li>
                <li><a href="index.html#">选项2</a>
                </li>
            </ul>
            <a class="close-link">
                <i class="fa fa-times"></i>
            </a>
        </div>
    </div>
    <div class="ibox-content no-padding">
        <ul class="list-group">
            <li class="list-group-item"  v_bind="id" v_for ="(news ,i) in newses">
                <p><a class="text-info" href="index.html#">{{news.topic}}</a> {{news.title}}</p>
                <small class="block text-muted"><i class="fa fa-clock-o"></i> {{news.time}}</small>
            </li>
            <li class="list-group-item">
                <p><a class="text-info" href="index.html#">@颜文字君</a> 女生身高×1.09后，就是最适合你的男生身高；相反，男生是÷1.09就可以了..小伙伴们可以试着算下..【图是我的..(*/ω＼*)</p>
                <div class="text-center m">
                    <span id="sparkline8"><canvas width="170" height="150" style="display: inline-block; width: 170px; height: 150px; vertical-align: top;"></canvas></span>
                </div>
                <small class="block text-muted"><i class="fa fa-clock-o"></i> 2小时前</small>
            </li>
         
        </ul>
    </div>
</div>-->
</template>
<style>
@import "../css/bootstrap.min.css";
@import "../css/style.min.css";
</style>
<script>
export default {
  name: "newspage",
  data() {
    return {
      newses: [
        {
            id:1,
          topic: "#小游戏#",
          title:
            "女生身高×1.09后，就是最适合你的男生身高；相反，男生是÷1.09就可以了..小伙伴们可以试着算下..【图是我的..(*/ω＼*)",
          time: "18分钟"
        },
        {
          topic: "#女孩子就最重要了#",
          title:
            "刚才剪发，顾客在看这个视频，妈蛋，这舞姿太销魂了，笑得手颤抖。。。",
          time: "1天之前"
        },
        {
          topic: "#小游戏#",
          title:
            "——#陈氏父子# cut：“他是我的陈爸爸”[心]“我叫陈思成，陈老师的陈” [心]“不再见就是，你也好，爸爸也好，妈妈也好，都永远不要说再见",
          time: "3年没见"
        },
        {
          topic: "#明天#",
          title:
            "How are you . Do you have rest ? I want to meet you at 20 Oclock at eveing .",
          time: "1天之前"
        },
        {
          topic: "#明天#",
          title:
            "Ok ,I must to say I am glad to hear this message ,and I have time at 20 Oclock .I will perpare some food and maybe We can have a diner toghter",
          time: "20天之前"
        }
      ],
      msg: "Welcome to Your Vue.js App"
    };
  }
};
</script>
